<template>
  <div>
    <div class="box">
      <RouterView />
    </div>
    <van-tabbar v-model="active">
      <van-tabbar-item icon="home-o"><a href="/home"> 首页</a></van-tabbar-item>
      <van-tabbar-item icon="search"><a href="/list"> 分类</a></van-tabbar-item>
      <van-tabbar-item icon="friends-o"
        ><a href="/car"> 购物车</a></van-tabbar-item
      >
      <van-tabbar-item icon="setting-o"
        ><a href="/my"> 我的</a></van-tabbar-item
      >
    </van-tabbar>
  </div>
</template>

<script lang='ts' setup>
import { ref } from "vue";
import { RouterLink, RouterView } from "vue-router";

const active = ref(0);
</script>

<style scoped>
.box{
  height: calc(100vh - 50px);
}
</style>
